{% extends  "main.html" %}
{% block content %}
    {% load staticfiles %}

    <div class="col-md-2" style="padding: 3px;">
        <select type="select" id="fodder_style" class="chosen-select form-control" data-placeholder="請選擇素材類型"
                style="width: 100%;color: #9999999;">
            <option value="" style="display: none;">請選擇素材類型</option>
            <option value="高清圖片" value1="image">高清圖片</option>
            <option value="Logo" value1="image">Logo</option>
            <option value="矢量圖標" value1="image">矢量圖標</option>
            <option value="psd,gif,jpg,jpeg,png,gif,jpg,png,bmp" value1="psd">PSD素材</option>
            <option value="3ds,max,mtl,obj,dwg,lwo,vrml,gif,jpg,jpeg,png,gif,jpg,png,bmp" value1="3d">3D模型</option>
        </select>
    </div>
    <div class="col-md-2" style="padding: 3px;">
        <select type="select" id="fodder_style1" class="chosen-select form-control" data-placeholder="請選擇素材類型"
                style="width: 100%;color: #9999999;">
            <option value="" style="display: none;">請選擇Title</option>
        </select>
    </div>
    <script>
        $(document).ready(function () {
            $('#fodder_style').change(function () {
                var select1=$('#fodder_style').val();
                console.log(select1);
                if (select1=='高清圖片'){
                    var aa='<option value="朦朧美網頁背景">朦朧美網頁背景</option>'+
                           '<option value="卡通網頁背景圖">卡通網頁背景圖</option>'+
                           '<option value="星空藍網頁背景圖">星空藍網頁背景圖</option>'+
                           '<option value="雪花網頁背景圖">雪花網頁背景圖</option>'+
                           '<option value="商務網頁背景">商務網頁背景</option>'+
                           '<option value="條紋網頁背景圖">條紋網頁背景圖</option>'+
                           '<option value="石紋網頁背景圖">石紋網頁背景圖</option>'+
                           '<option value="紙張網頁背景圖">紙張網頁背景圖</option>'+
                           '<option value="科技化網頁背景">科技化網頁背景</option>'+
                           '<option value="卡通網頁背景圖">卡通網頁背景圖</option>'+
                           '<option value="星空藍網頁背景圖">星空藍網頁背景圖</option>'+
                           '<option value="商務網頁背景圖">商務網頁背景圖</option>'+
                           '<option value="其他">其他</option>'

                }else if(select1=='Logo'){
                    var aa='<option value="不同顏色的BEACON logo">不同顏色的BEACON logo</option>'+
                           '<option value="BEACON所有項目logo">BEACON所有項目logo</option>'+
                           '<option value="網頁loading GIF圖片（加載）">網頁loading GIF圖片（加載）</option>'+
                           '<option value="網頁hot小圖標（熱）">網頁hot小圖標（熱）</option>'+
                           '<option value="其他">其他</option>'
                }else if(select1=='矢量圖標'){
                    var aa='<option value="高樓建築元素矢量圖標">高樓建築元素矢量圖標</option>'+
                           '<option value="其他">其他</option>'
                }else if(select1=='psd,gif,jpg,jpeg,png,gif,jpg,png,bmp'){
                    var aa='<option value="藍色手繪風圖標">藍色手繪風圖標</option>'+
                           '<option value="太陽公公">太陽公公</option>'+
                           '<option value="卡通電子">卡通電子</option>'+
                           '<option value="扁平化風格圖標">扁平化風格圖標</option>'+
                           '<option value="IOS系統圖標">IOS系統圖標</option>'+
                           '<option value="雪花">雪花</option>'+
                           '<option value="IOS7風格簡潔線條圖">IOS7風格簡潔線條圖</option>'+
                           '<option value="白色按鈕綠色底">白色按鈕綠色底</option>'+
                           '<option value="滑動界面設計">滑動界面設計</option>'+
                           '<option value="圓形絲網狀原件">圓形絲網狀原件</option>'+
                           '<option value="半透明信息提示框">半透明信息提示框</option>'+
                           '<option value="手機導航條元素">手機導航條元素</option>'+
                           '<option value="其他">其他</option>'
                }
            document.getElementById("fodder_style1").innerHTML=aa;
            })

        })
    </script>
{% endblock %}